<template>
	<div>
		<div class="hello_d">
			<!-- 我的上部分 -->
			<router-link to="wode">
				<div class="top_d">
					<div class="tpleft_d">&#xe74a;</div>
					<div class="tpright_d">我的积分</div>
				</div>
			</router-link>
			<div class="sss">
				<div class="aaa">
					<div class="ass">
						<p>当前积分</p>
						<router-link to="jifenshuoming" id="jifenshuoming">
							<img src="../assets/ques.png" alt="" id="img">
							<span class="zzz">积分说明</span>
						</router-link>
					</div>
					<span class="ccc">0</span>分
					<p class="sc">积分兑换商品</p>
				</div>
				<p class="jiao">最近30天积分记录</p>
			</div>
			<div class="tu">
				  <img src="../assets/rr.png" alt="">
				  
			</div>
	      <p class="zui">最近30天无积分记录</p>
		  <p class="kuai">快去下单赚取大量积分吧</p>
		</div>
	</div>
</template>

<script>
</script>

<style scoped>
	.hello_d {
		width: 100%;
		height: 2.5rem;
		background: #3190E8;
	}
	
	.top_d {
		width: 100%;
		height: 50px;
		border-bottom: 1px solid white;
		line-height: 50px;
	}
	
	.tpleft_d {
		font-family: 'iconfont';
		position: absolute;
		left: 0;
		top: 0;
		font-size: 20px;
		color: #ffffff;
	}
	
	.tpright_d {
		position: fixed;
		right: 35%;
		top: 0;
		font-size: 50px;
	}
	
	@font-face {
		font-family: 'iconfont';
		src: url('//at.alicdn.com/t/font_1566197_psfss4eivem.eot');
		src: url('//at.alicdn.com/t/font_1566197_psfss4eivem.eot?#iefix') format('embedded-opentype'),
			url('//at.alicdn.com/t/font_1566197_psfss4eivem.woff2') format('woff2'),
			url('//at.alicdn.com/t/font_1566197_psfss4eivem.woff') format('woff'),
			url('//at.alicdn.com/t/font_1566197_psfss4eivem.ttf') format('truetype'),
			url('//at.alicdn.com/t/font_1566197_psfss4eivem.svg#iconfont') format('svg');
	}
	.sss {
		height: 280px;
		background-color: #3190E8;
	}
	
	.aaa {
		padding: 1rem;
		background-color: #fff;
		width: 650px;
		margin-left: 20px;
		margin-top: 30px;
		height: 200px;
		border-radius: 20srem;
	}
	
	.ass {
		font-size: 20px;
	}
	#jifenshuoming img {
		width: 30px;
		height: 30px;
		position: absolute;
		right: 5px;
		top: 20px;
	}
	
	#img {
		position: absolute;
		left: 580px;
		margin-top: 85px;
	}
	
	.zzz {
		font-size: 10px;
		left: 630px;
		top: 113px;
		position: absolute;
	}
	
	.ccc {
		font-size: 2.5rem;
		color: #000000;
		font-weight: 700;
		margin-top: 4rem;
	}
	.sc {
		width: 96%;
		margin: 1.3rem auto 0;
		line-height: 2.1rem;
		border-radius: 5px;
		text-align: center;
		background-color: #FF5F3E;
		font-size: 40px;
		color: #FFFFFF;
	}
	
	.jiao {
		margin-left: 30px;
		margin-top: 30px;
	}
	.tu{
		margin-left: 300px;
		margin-top: 250px;
	}
	.zui{
		margin-left: 200px;
	}
	.kuai{
		margin-left: 220px;
		margin-top: 15px;
		font-size: 10px;
	}
</style>
